/**
 * Created by yelan on 2018/8/19.
 */
import React, {Component} from 'react';
import PropTypes from 'prop-types';

import ContactList from './ContactList';
import SearchBar from './SearchBar';

class ContactsApp extends Component {
    constructor() {
        super(...arguments);
        this.state = {
            contacts: this.props.initialData || [],
            filterText: ''
        }
    }

    handlerUserInput(input) {
        this.setState({filterText: input});
    }

    render() {
        return (
            <div>
                <SearchBar filterText={this.state.filterText}
                           onUserInput={this.handlerUserInput.bind(this)}/>
                <ContactList contacts={this.state.contacts}
                             filterText={this.state.filterText}/>
            </div>
        )
    }
}

ContactsApp.propTypes = {
    initialData: PropTypes.any
};

export default ContactsApp;